// 项目的根组件，一切组件的根基
// App被引入到了index.js,渲染到public/index.html文件中id为root的div

// React组件基础的样式控制有俩种方式，行内样式和class类名控制

// 导入样式
import './css/foo.css'

// 可以把样式写到一个对象里面
const style = {
  color: 'red',
  fontSize: '50px'
}

function App09() {
  
  return (
    <div className="App">
      {/* 行内样式控制 */}
      <span style={{color: 'red', fontSize: '35px'}}>this is span<br/></span>
      <span style={style}>this is span2<br/></span>
      {/* 通过class类名控制样式 */}
      <span className="foo">this is class foo</span>
    </div>
  )
}

export default App09
